<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>站点管理·思通投研·让数据驱动投资价值!</title>
<link href="${pageContext.request.contextPath }/img/webLogoIcon.png"
	rel="shortcut icon">
<link href="${pageContext.request.contextPath }/css/bootstrap.min.css"
	rel="stylesheet">
<link href="${pageContext.request.contextPath }/css/font-awesome.css"
	rel="stylesheet">

<link href="${pageContext.request.contextPath }/css/animate.css"
	rel="stylesheet">
<link href="${pageContext.request.contextPath }/css/style.css"
	rel="stylesheet">


<link
	href="${pageContext.request.contextPath }/css/plugins/sweetalert/sweetalert.css"
	rel="stylesheet">

<!-- FooTable -->
<link href="${pageContext.request.contextPath }/css/footable.core.css"
	rel="stylesheet">
<link href="${pageContext.request.contextPath }/css/datepicker3.css"
	rel="stylesheet">
<link href="${pageContext.request.contextPath}/css/mypage.css"
	rel="stylesheet">
<style>
.select2_demo_1 {
	float: left;
	width: 120px;
	display: inline;
	margin-left: 10px;
}

.form-control {
	display: inline;
}

.col-sm-3 {
	float: right;
	width: 560px;
}

.input-group {
	float: right;
	width: 240px;
	margin-left: 5px;
}

td {
	vertical-align: middle;
}

.main-content {
	width: 100%;
	min-height: calc(100vh - 300px);
	background: #fff;
	border-radius: 4px;
	padding: 20px;
	border: 1px solid #e8e8e8;
}

.addkeywords::after {
	content: '';
	display: block;
	clear: both;
}

.addkeywords {
	width: 100%;
	border-bottom: 1px solid #e8e8e8;
	padding-bottom: 10px;
}

.addkeywords input {
	width: 500px;
	float: left;
}

.addkeywords button {
	margin-left: 20px;
	float: left;
}

.key-content {
	width: 100%;
}

.key-content span {
	display: inline-block;
	padding: 0 8px;
	line-height: 30px;
	font-size: 14px;
	border: 1px solid #faad14;
	border-radius: 4px;
	color: #5a5a5a;
	margin: 10px 10px 0 0;
}

.key-content span i {
	color: #5a5a5a;
	margin-left: 5px;
	cursor: pointer;
}

.key-content span i:hover {
	color: #faad14;
}

.pages {
	width: 100%;
	min-height: 40px;
	margin-top: 20px;
	border-top: 1px solid #e8e8e8;
}

.website_type {
	border: 1px solid;
	padding: 7px 10px;
	margin-right: 10px;
	border-radius: 5px;
	cursor: pointer;
}

.mainstream_flag {
	border: 1px solid;
	padding: 7px 10px;
	margin-right: 10px;
	border-radius: 5px;
	cursor: pointer;
}

#search:active{
	background:rgb(203,249,179);
}
</style>
</head>
<body>
	<nav class="navbar-default navbar-static-side" role="navigation">
		<%request.setAttribute("LEFT", "website_admin");%>
		<%@include file="../datasource-left.jsp"%>
	</nav>

	<div id="page-wrapper" class="gray-bg">
		<div class="row border-bottom">
			<jsp:include page="../head-factory.jsp" flush="true" />
		</div>

		<div class="row wrapper border-bottom white-bg page-heading">
			<div class="col-lg-9">
				<h2>站点管理</h2>
				<ol class="breadcrumb">
					<li class="nav-main1"><a>主页</a>
					</li>

					<li class="active"><a>站点管理</a></li>
				</ol>
			</div>
		</div>

		<div class="wrapper wrapper-content animated fadeInRight">
			<!-- 内容开始 start-->
			<div class="row">
				<div class="col-lg-12 main-content">
					<div class="input-select" style="margin-bottom: 20px">
                   		<div>
                            <input id="keywords" placeholder="网站名称、url、备注、备案信息" type="text" class="form-control" style="width:250px;">
                            <input id="sponsor_name" placeholder="主办单位名称" type="text" class="form-control" style="width:150px;margin-left:20px;">
					        <select class="form-control" id="sponsor_nature" style="width:120px;margin-left:20px;">
						        <option selected disabled style="display:none;">单位性质</option>
						        <option></option>
					        </select>
					        <span style="font-size:1.1em;margin-left:20px;">是否是主流网站：</span>
					        <span>
					        	<span class="mainstream_flag" onclick="is_mainstream(this)" mainstream_flag=1>是</span>
					        	<span class="mainstream_flag" onclick="is_mainstream(this)" mainstream_flag=2>否</span>
					        </span>
					        <select class="form-control" id="province" onchange="loadCity()" style="width:100px;margin-left:20px;">
						        <option selected disabled style="display:none;">省</option>
						        <option></option>
						        <option>国家</option>
					        </select>
					        <select class="form-control" id="city" style="width:100px;margin-left:10px;" disabled>
					        </select>
                        </div>
                    </div>
                    <div style="margin-bottom: 20px;margin-left:10px;">
	                    <span style="font-size:1.1em;">网站类型：</span>
	                    <span class="website_type" onclick="clickWebType(this)" webType=5>新闻</span>
	                    <span class="website_type" onclick="clickWebType(this)" webType=3>政务</span>
	                    <span class="website_type" onclick="clickWebType(this)" webType=4>论坛</span>
	                    <span class="website_type" onclick="clickWebType(this)" webType=11>博客</span>
	                    <span class="website_type" onclick="clickWebType(this)" webType=6>报刊</span>
	                    <span class="website_type" onclick="clickWebType(this)" webType=8>网站</span>
	                    <span class="website_type" onclick="clickWebType(this)" webType=9>外媒</span>
	                    <span class="website_type" onclick="clickWebType(this)" webType=1>微信</span>
	                    <span class="website_type" onclick="clickWebType(this)" webType=2>微博</span>
	                    <span class="website_type" onclick="clickWebType(this)" webType=7>客户端</span>
	                    <span class="website_type" onclick="clickWebType(this)" webType=12>自媒体</span>
	                    <span class="website_type" onclick="clickWebType(this)" webType=10>视频</span>
	                </div>
	                <div style="margin-bottom: 20px;margin-left:10px;">
	                	<span style="font-size:1.1em;">排序方式：</span>
	                	<select id="sort_field" style="height:20px;">
	                		<option value=0>pr值</option>
	                		<option value=1>百度权重</option>
	                		<option value=2>自定义排名</option>
	                		<option value=3 selected>创建时间</option>
	                	</select>
				        <label class="form-check-label" style="margin-left:10px;">
				           <input type="radio" class="form-check-input" name="sort_type" value=1 checked>
				                      从大到小
				        </label>
				        <label class="form-check-label" style="margin-left:5px;">
				           <input type="radio" class="form-check-input" name="sort_type" value=0>
				                      从小到大
				        </label>
				        <span style="font-size:1.1em;margin-left:20px;">pr值：</span>
				        <input type="text" style="width:50px;" id="pr1"><span style="margin: 0px 3px;">-</span><input type="text" style="width:50px;" id="pr2">
				        <span style="font-size:1.1em;margin-left:20px;">百度权重：</span>
				        <input type="text" style="width:50px;" id="bd1"><span style="margin: 0px 3px;">-</span><input type="text" style="width:50px;" id="bd2">
				        <span style="font-size:1.1em;margin-left:20px;">自定义排名：</span>
				        <input type="text" style="width:50px;" id="defined1"><span style="margin: 0px 3px;">-</span><input type="text" style="width:50px;" id="defined2">
	                </div>
	                <div style="text-align:center;margin-bottom: 10px;">
	                	<button id="search" style="padding:5px 150px;font-size:1.2em;border-radius:8px;border:none;">搜索</button>
	                </div>
					<div class="ibox-content">
						<button type="button" class="btn btn-gray" onclick="window.location.href='${pageContext.request.contextPath}/datasourcesite/addwebsite'" style="float:right;margin-right:35px;">新增</button>
<!-- 						<div id="addkeywords" class="addkeywords form-group"> -->
<!-- 							<input type="text" -->
<!-- 								class="form-control" id="remark" placeholder="输入需要添加的词，多个词用,间隔"> -->
<!-- 							<button class="btn btn-primary" onclick="add()">确认添加</button> -->
<!-- 						</div> -->
						<table class="footable table table-stripped toggle-arrow-tiny"
							data-page-size="25">
							<thead>
								<tr>
									<th style="width: 15%;">站点名称</th>
									<th style="width: 5%;">网站链接</th>
									<th style="width: 10%;">站点类别</th>
<!-- 									<th style="width: 15%;">备案信息</th> -->
									<th style="width: 20%;">单位名称</th>
									<th style="width: 5%;">是否主流网站</th>
									<th style="width: 5%;">pr值</th>
									<th style="width: 5%;">百度权重</th>
									<th style="width: 5%;">自定义排名</th>
									<th style="width: 5%;">省</th>
									<th style="width: 5%;">市</th>
									<th style="width: 10%;">创建时间</th>
									<th style="width: 10%;">操作</th>
								</tr>
							</thead>
							<tbody id="list">
							</tbody>
							<tfoot>
								<tr>
									<td colspan="7">
										<div class="box" id="box" style="float: right;"></div>
									</td>
								</tr>
							</tfoot>
						</table>

					</div>


				</div>
			</div>
			<!-- 内容开始 end-->
			<jsp:include page="../footer.jsp" flush="true" />
		</div>



	</div>

	<!-- Mainly scripts -->
	<script src="${pageContext.request.contextPath }/js/jquery-2.1.1.js"></script>
	<script src="${pageContext.request.contextPath }/js/bootstrap.min.js"></script>
	<script
		src="${pageContext.request.contextPath }/js/jquery.metisMenu.js"></script>
	<script
		src="${pageContext.request.contextPath }/js/jquery.slimscroll.min.js"></script>

	<!-- Custom and plugin javascript -->
	<script src="${pageContext.request.contextPath }/js/inspinia.js"></script>
	<script src="${pageContext.request.contextPath }/js/pace.min.js"></script>



	<!-- FooTable -->
	<script
		src="${pageContext.request.contextPath }/js/footable.all.min.js"></script>
	<script src="${pageContext.request.contextPath}/js/mypage.js"></script>

	<script
		src="${pageContext.request.contextPath }/js/plugins/toastr/toastr.min.js"></script>
	<!-- Sweet alert -->
	<script
		src="${pageContext.request.contextPath }/js/plugins/sweetalert/sweetalert.min.js"></script>
	<script
		src="${pageContext.request.contextPath }/js/block-ui/jquery.blockUI.js"></script>
	<script
		src="${pageContext.request.contextPath }/js/province_city.js"></script>
	<!-- Page-Level Scripts -->
	<script type="text/javascript">
		$(function () {
			loadSponsorNature()
			loadProvince()
	        list(1)
	    });
		
		$('#search').click(function(){
			list(1)
		})
		
		function clickWebType(el){
			if($(el).attr('style')==undefined){
				$(el).css('background', 'rgb(97,132,230)')
				$(el).css('color', 'white')
			}else{
				$(el).removeAttr('style')
			}
		}
		
		function is_mainstream(el){
			if($(el).attr('style')==undefined){
				$(el).css('background', 'rgb(97,132,230)')
				$(el).css('color', 'white')
				$(el).siblings().removeAttr('style')
			}else{
				$(el).removeAttr('style')
			}
		}
		
		function list(pageNum){
			let keywords=$('#keywords').val().trim()
			let typeEls=document.getElementsByClassName('website_type')
			let types=''
			for(let typeEl of typeEls){
				if($(typeEl).attr('style')!=undefined){
					types+=$(typeEl).attr('webType')+','
				}
			}
			console.log(types)
			let sponsor_name=$('#sponsor_name').val().trim()
			let sponsor_nature=$('#sponsor_nature').val()
			let mainstreamEls=document.getElementsByClassName('mainstream_flag')
			let mainstream_flag=0
			for(let mainstream of mainstreamEls){
				if($(mainstream).attr('style')!=undefined){
					mainstream_flag=$(mainstream).attr('mainstream_flag')
					break
				}
			}
			let min_pr=$('#pr1').val().trim()
			let max_pr=$('#pr2').val().trim()
			if(isNaN(min_pr) || isNaN(max_pr) ||
					(min_pr != '' && !isNaN(min_pr) && min_pr<0) || (max_pr != '' && !isNaN(max_pr) && max_pr<0) ||
					(min_pr != '' && max_pr != '' && !isNaN(min_pr) && !isNaN(max_pr) && min_pr>max_pr)){
				showtips('请正确填写pr值筛选项')
				min_pr=''
				max_pr=''
			}
			let min_bd=$('#bd1').val().trim()
			let max_bd=$('#bd2').val().trim()
			if(isNaN(min_bd) || isNaN(max_bd) ||
					(min_bd != '' && !isNaN(min_bd) && min_bd<0) || (max_bd != '' && !isNaN(max_bd) && max_bd<0) ||
					(min_bd != '' && max_bd != '' && !isNaN(min_bd) && !isNaN(max_bd) && min_bd>max_bd)){
				showtips('请正确填写百度权重筛选项')
				min_bd=''
				max_bd=''
			}
			let min_defined=$('#defined1').val().trim()
			let max_defined=$('#defined2').val().trim()
			if(isNaN(min_defined) || isNaN(max_defined) ||
					(min_defined != '' && !isNaN(min_defined) && min_defined<0) || (max_defined != '' && !isNaN(max_defined) && max_defined<0) ||
					(min_defined != '' && max_defined != '' && !isNaN(min_defined) && !isNaN(max_defined) && min_defined>max_defined)){
				showtips('请正确填写自定义排名筛选项')
				min_defined=''
				max_defined=''
			}
			let province=$('#province').val()
			let city=$('#city').val()
			$.ajax({
				url: "${pageContext.request.contextPath}/admin/list",
				type: "post",
				data:{
					pageNum: pageNum,
					keywords: keywords=='' ? undefined : keywords,
					types: types=='' ? undefined : types,
					sort_field: $('#sort_field').val(),
					sort_type: $('input[type="radio"]:checked').val(),
					sponsor: sponsor_name=='' ? undefined : sponsor_name,
					sponsor_nature: sponsor_nature=='' || sponsor_nature==null ? undefined : sponsor_nature,
					mainstream_flag: mainstream_flag==0 ? undefined : mainstream_flag,
					min_pr: min_pr == '' ? undefined : min_pr,
					max_pr: max_pr == '' ? undefined : max_pr,
					min_bd: min_bd == '' ? undefined : min_bd,
					max_bd: max_bd == '' ? undefined : max_bd,
					min_defined: min_defined == '' ? undefined : min_defined,
					max_defined: max_defined == '' ? undefined : max_defined,
					website_province: province=='' || province==null ? undefined : province,
					website_city: city=='' || city==null ? undefined : city
				},
				success: function(res){
					$('#list').html('')
					let list=res.list
					if(list.length>0){
						paging(res.pageInfo.total,res.pageInfo.pages,res.pageInfo.pageNum)
					}else{
						$('#list').html('暂无数据！')
						$('#box').html('')
					}
					for(let i=0;i<list.length;i++){
						let selectHtml='<select id="select'+list[i].id+'" style="width:60px;" onchange="changeType('+list[i].id+')">'
						let webtypeStr=''
						for(let j=0;j<14;j++){
							switch (j) {
							case 1:
								webtypeStr='微信'
								break;
							case 2:
								webtypeStr='微博'
								break;
							case 3:
								webtypeStr='政务'
								break;
							case 4:
								webtypeStr='论坛'
								break;
							case 5:
								webtypeStr='新闻'
								break;
							case 6:
								webtypeStr='报刊'
								break;
							case 7:
								webtypeStr='客户端'
								break;
							case 8:
								webtypeStr='网站'
								break;
							case 9:
								webtypeStr='外媒'
								break;
							case 10:
								webtypeStr='视频'
								break;
							case 11:
								webtypeStr='博客'
								break;
							case 12:
								webtypeStr='自媒体'
								break;
							case 13:
								webtypeStr='招投标'
								break;
							}
							if(list[i].new_website_type==j){
								selectHtml+='<option value='+j+' selected>'+webtypeStr+'</option>'
							}else{
								selectHtml+='<option value='+j+'>'+webtypeStr+'</option>'
							}
						}
						selectHtml+='</select>'

						$('#list').append(
							'<tr>'+
								'<td><a href="${pageContext.request.contextPath}/datasourcesite/detail/'+list[i].id+'" target="_blank">'+list[i].website_name+'</a></td>'+
								'<td><a href="'+list[i].website_url+'" target="_blank">'+list[i].website_url+'</a></td>'+
								'<td>'+selectHtml+'</td>'+
// 								'<td>'+(list[i].icp_info==undefined ? '暂无' : list[i].icp_info)+'</td>'+
								'<td>'+(list[i].sponsor==undefined ? '暂无' : list[i].sponsor)+'</td>'+
								'<td>'+(list[i].mainstream_flag==1 ? "是" : "否")+'</td>'+
								'<td>'+(list[i].website_pr==undefined ? '暂无' : list[i].website_pr)+'</td>'+
								'<td>'+(list[i].baidu_weight==undefined ? '暂无' : list[i].baidu_weight)+'</td>'+
								'<td>'+(list[i].site_rank==undefined ? '暂无' : list[i].site_rank)+'</td>'+
								'<td>'+(list[i].website_province==undefined ? '暂无' : list[i].website_province)+'</td>'+
								'<td>'+(list[i].website_city==undefined ? '暂无' : list[i].website_city)+'</td>'+
								'<td>'+list[i].date+'</td>'+
								'<td><button style="margin-right:5px;">修改</button><button>删除</button></td>'+
							'</tr>'
						)
					}
				}
			})
		}
		
		function loadSponsorNature(){
			$.ajax({
				url: '${pageContext.request.contextPath}/admin/loadSponsorNature',
				type:'get',
				data:{
				},
				success:function(res){
					for(let sponsor_nature of res){
						$('#sponsor_nature').append('<option>'+sponsor_nature+'</option>')
					}
				}
			})
		}
		
		function loadProvince(){
			console.log("length:"+provinces.length)
			for(let province of provinces){
				$('#province').append('<option>'+province.name+'</option>')
			}
		}
		
		function loadCity(){
			let province=$('#province').val()
			if(province=='' || province=='国家'){
				$('#city').attr('disabled', true)
			}else{
				$('#city').removeAttr('disabled')
				$('#city').html('')
				$('#city').append('<option selected disabled style="display:none;">市</option><option></option>')
				for(let p of provinces){
					if(p.name==province){
						let citys=p.city
						for(let city of citys){
							if(city.name.endsWith('市') || city.name.endsWith('州')){
								$('#city').append('<option>'+city.name.substring(0,city.name.length-1)+'</option>')
							}else if(city.name.endsWith('地区')){
								$('#city').append('<option>'+city.name.substring(0,city.name.length-2)+'</option>')
							}else{
								$('#city').append('<option>'+city.name+'</option>')
							}
						}
						break
					}
				}
			}
		}
		
		function changeType(id){
			$.ajax({
				url: '${pageContext.request.contextPath}/admin/updateWebType',
				type: 'post',
				data:{
					id: id,
					webType: $('#select'+id).val()
				},
				success:function(res){
					showtips('更新成功！')
				},
				error:function(res){
					showtips('更新失败！')
				}
			})
		}
		
		function showtips(name) {
		    $.blockUI({
		        message: name,
		        fadeIn: 700,
		        fadeOut: 700,
		        timeout: 3000,
		        showOverlay: false,
		        centerY: false,
		        css: {
		            width: '250px',
		            top: '20px',
		            left: '',
		            right: '20px',
		            border: 'none',
		            padding: '15px 5px',
		            backgroundColor: '#000',
		            '-webkit-border-radius': '10px',
		            '-moz-border-radius': '10px',
		            opacity: 0.9,
		            color: '#fff'
		        }
		    });
		}
		
		function paging(totalData, totalPage, pagenum) {
	        $('#box').paging({
	            initPageNo: pagenum, // 初始页码
	            totalPages: totalPage, //总页数
	            totalCount: '合计' + totalData + '条数据', // 条目总数
	            slideSpeed: 600, // 缓动速度 单位毫秒
	            jump: true, //是否支持跳转
	            callback: function (page) {
	                // 回调函数
	            }
	        });
	    }
		
		
		function JumpToPage(pagenum) {
	        list(pagenum)
	    }
		</script>
</body>

</html>
